
<script src="bower_components/katex/build/katex.js"></script>

<dom-module
    id="ka-tex"
    >

<template>
  <link rel="stylesheet" href="bower_components/katex/build/katex.min.css">
  <span id="rendered"></span>
</template>

<script>

Polymer({
  is: "ka-tex",
  behaviors: [EscherMixins.LifeCycle],

  properties: {
    source: {
      type: String,
      value: "",
      observer: "_sourceChanged"
    },
    block: {
      type: Boolean,
      value: false,
      observer: "_blockChanged"
    },
  },
  render: function () {
    katex.render(this.source, this.$.rendered, {displayMode: this.block})
  },
  domInit: function () {
    this.render()
  },
  _sourceChanged: function () {
    this.render()
  },
  _blockChanged: function () {
    this.render()
  }
})
</script>

</dom-module>
